{include file="header.html"}
<body class="gr">

<div class="navBar">
	<a class="left" href="javascript:history.back()"><i class="return"></i></a>
	<div class="titleView">发表攻略</div>
</div>

<form action="api.php?app=article&act=add" method="post">
<input type="hidden" name="gourl" value="wap.php?app=article&act=index" />
<input type="hidden" name="goalert" value="提交成功" />
<div class="discover-edit main-top main-bottom">
	<div class="view ge-bottom ge-light">
		<div class="picView">
			<a class="plus" href="javascript:void(0)"></a>
		</div>
		<div class="tip"><span>提示：请上传攻略图片</span></div>
	</div>
	
	<div class="view ge-bottom ge-light">
		<div class="title">
			<font>标题</font>
			<input type="text" name="title" id="title" placeholder="请输入标题" />
		</div>
	</div>
	
	<div class="view">
		<a class="goods push-ico" href="javascript:void(0)">添加关联商品</a>
	</div>
	<ul class="view goodsView"></ul>
	
	<div class="view con ge-top ge-light">
		攻略内容
	</div>
	<div class="view">
		<div class="content">
			<textarea name="content" id="content" placeholder="请输入攻略内容"></textarea>
		</div>
	</div>
	
	<a class="btn" href="javascript:void(0)">发表</a>
</div>
<input type="hidden" name="pics" id="pics" />
<input type="hidden" name="goods" id="goods" />
</form>

{include file="footer.html"}
<script>
var maxCount = 3, images = [];
$(function(){
	$('.plus').ajaxupload({
		after : function(){
			if(images.length>=maxCount){
				$.overloadWarning('最多只能选择'+maxCount+'张');
				return false;
			}
		},
		takeover : function(file){
			$.overload();
			file.upyun({
				folder : 'uploadfiles/article',
				bucket : 'bangfang',
				secret : 'GsOzJRoyHKUlHxTWFd97iuV5nUw=',
				imgurl : 'http://bangfang.b0.upaiyun.com',
				complete : function(url, name, json){
					$.overload(false);
					images.push(url);
					var image = $('<a href="javascript:void(0)" style="background-image:url('+url+');"></a>');
					$('.plus').before(image);
					image.loadbackground();
				}
			});
		}
	});
	$('.goods').click(getGoods);
	$('.btn').click(function(){
		if(!images.length){
			$.overloadError('请选择攻略图片');
			return false;
		}
		if(!$('#title').val().length){
			$.overloadError('请输入标题');
			return false;
		}
		if(!$('#content').val().length){
			$.overloadError('请输入攻略内容');
			return false;
		}
		$('#pics').val($.jsonString(images));
		if($('.goodsView').children().length){
			var goods = [];
			$('.goodsView').children().each(function(){
				goods.push($(this).attr('gid'));
			});
			$('#goods').val($.jsonString(goods));
		}
		$('form').submit();
	});
});

function getGoods(){
	var _this = $(this);
	var html = '<div class="faceView" style="background:#fff;">\
					<div class="navBar">\
						<a class="left" href="wap.php"><i class="return"></i></a>\
						<div class="titleView search-input"><input type="search" id="keyword" placeholder="请输入商品关键字" /></div>\
						<a class="right" href="javascript:void(0)">搜索</a>\
					</div>\
					<div class="search-list main-padding-top">\
						<div class="searchHistory">\
							<div class="title"><a href="javascript:void(0)"></a>搜索历史</div>\
							<ul class="list"></ul>\
						</div>\
						<div class="pullRefresh">\
							<ul class="list goods-item"></ul>\
						</div>\
					</div>\
				</div>';
	$('body').append(html);
	var faceView = bindFaceView(null, '.search-list');
	$('.search-list').height($.window().height-$('.search-list').padding().top);
	$('.faceView .navBar .right').click(clickRight);
	$.getJSON('api.php?app=home&act=search_history', function(json){
		var html = '';
		if(!$.isArray(json.data)){
			$('.searchHistory .title a').hide();
			html += '<li class="norecord">暂无搜索历史</li>';
		}else{
			for(var i=0; i<json.data.length; i++){
				html += '<li><a href="javascript:void(0)">'+json.data[i].content+'</a></li>';
			}
		}
		$('.searchHistory .list').html(html);
		$('.searchHistory .list a').click(function(){
			$('#keyword').val($(this).html());
			clickRight();
		});
	});
	$('.searchHistory .title a').click(function(){
		var _this = $(this);
		$.getJSON('api.php?app=home&act=clear_search_history', function(json){
			_this.hide();
			var html = '<li class="norecord">暂无搜索历史</li>';
			$('.searchHistory .list').html(html);
		});
	});
	$('.pullRefresh').pullRefresh({
		header : true,
		footer : true,
		footerNoMoreText : '- END -',
		refresh : function(fn){
			var _this = this;
			offset = 0;
			$.getJSON('api.php?app=goods&act=index&keyword='+$('#keyword').val(), function(json){
				if(json.error!=0){ $.overloadError(json.msg);return }
				var html = '';
				if($.isArray(json.data.goods))for(var i=0; i<json.data.goods.length; i++)html += createHtml(json.data.goods[i]);
				_this.find('.list').html(html);
				setLists();
				bindDelegate();
				fn();
			});
		},
		load : function(fn){
			var _this = this;
			$.getJSON('api.php?app=goods&act=index&keyword='+$('#keyword').val(), { offset:offset }, function(json){
				if(json.error!=0){ $.overloadError(json.msg);return }
				var html = '';
				if($.isArray(json.data.goods))for(var i=0; i<json.data.goods.length; i++)html += createHtml(json.data.goods[i]);
				_this.find('.list').append(html);
				setLists();
				bindDelegate();
				fn();
			});
		}
	});
}

function createHtml(g){
	var html = '<li>\
		<a href="javascript:void(0)">\
			<div class="pic" style="background-image:url('+g.default_pic+');"></div>\
			<div class="title"><div>'+g.name+'</div><font>'+g.model+'</font><span><strong>￥</strong>'+g.price.numberFormat(2)+'</span></div>\
			<textarea>'+$.jsonString(g)+'</textarea>\
		</a>\
	</li>';
	offset++;
	return html;
}
function setLists(){
	var width = ($('.pullRefresh').width()-10*3) / 2;
	$('.list li').width(width);
	$('.list a .pic').loadbackground();
}
function clickRight(){
	var val = $('#keyword').val(), html = '';
	if(!val.length){
		$.overloadError('请输入关键字');
		return;
	}
	$('.faceView').css('background', '#f3f3f3');
	$('.searchHistory').hide();
	$('.pullRefresh').data('headerBegin')();
}
function bindDelegate(){
	$('.pullRefresh a').each(function(){
		var _this = $(this);
		if(!!_this.data('delegate'))return true;
		_this.data('delegate', true).click(function(){
			var g = $.formatJSON($(this).find('textarea').val()), goodsView = $('.goodsView');
			var row = $('<li gid="'+g.id+'">\
				<div class="row">\
					<a class="cl" href="javascript:void(0)"><span>－</span></a>\
					<a class="bo" href="wap.php?app=goods&act=detail&goods_id='+g.id+'">\
						<div class="pic" style="background-image:url('+g.default_pic+');"></div>\
						<div class="name">'+g.name+'</div>\
						<div class="price">￥'+g.price+'</div>\
					</a>\
				</div>\
			</li>');
			row.find('.cl').click(function(){
				var cl = $(this).parent().parent();
				cl.animate({ height:0 }, 200, function(){
					cl.remove();
				});
			});
			goodsView.append(row);
			removeFaceView();
		});
	});
}
</script>